﻿<!doctype html>
<html>
	<head>
	<meta charset="utf-8">
	<title>index</title>
	<script type="text/javascript" src="js/jquery.js"></script>
    <link rel="stylesheet" href="css/comon0.css">
	</head>
	<script type="text/javascript">
	$(document).ready(function(){
		var html=$(".wrap ul").html()
		$(".wrap ul").append(html)
		var ls=$(".wrap li").length/2+1
		i=0
		ref = setInterval(function(){
			i++
			if(i==ls){
				i=1
				$(".wrap ul").css({marginTop:0})
				$(".wrap ul").animate({marginTop:-'.52'*i+'rem'},1000)
			}
	    	$(".wrap ul").animate({marginTop:-'.52'*i+'rem'},1000)
		
		
		},2400);
		
		
		
				var html2=$(".adduser ul").html()
		$(".adduser ul").append(html2)
		var ls2=$(".adduser li").length/2+1
		a=0
		ref = setInterval(function(){
			a++
			if(a==ls2){
				a=1
				$(".adduser ul").css({marginTop:0})
				$(".adduser ul").animate({marginTop:-'.5'*a+'rem'},800)
			}
	    	$(".adduser ul").animate({marginTop:-'.5'*a+'rem'},800)
		
		
		},4300);
		
		
		
	
	
		
		
		
	})
	</script>
	<body>
<div class="loading">
      <div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
    </div>
<div class="head">
      <h1><a href="" style="color: white">船舶检测科普大屏
      </a></h1>

    </div>
<div class="mainbox">
      <ul class="clearfix">
          <li>
              <a href="https://www.cas.cn/syky/202304/t20230417_4884321.shtml" target="_blank">  <div class="boxall"
                                                                                       style="height:4.5rem;display: flex;flex-wrap: wrap;padding: 10px">
                  <div style="width: 100%;height: 60%;display: flex;justify-content: center;align-items: center">
                      <img src="./images/船2.png" alt="" style="width: 90%;height: 90%">
                  </div>
                  <div style="width: 100%;height: 40%;box-sizing: border-box;padding: 10px">
                      <p
                              style="color: white;display: flex;justify-content: center;align-items: center;font-size:
                              15px;font-weight: bold">&nbsp;&nbsp;&nbsp;&nbsp;雷达目标检测方面取得进展：
                          <br>
                          <br>
                          &nbsp;&nbsp;&nbsp;&nbsp;近日，中国科学院软件研究所研究团队在复杂背景下的雷达目标检测方面取得进展。。研究针对航海雷达目标检测中背景复杂、原始数据量大、有效数据量少以及检测任务困难等问题，提出了一种全新的基于对比学习的航海雷达目标检测方法CLMRD（Contrastive Learning for Marine Radar Detection）。</p>
                  </div>
                  <div class="boxfoot"></div>
              </div></a>
              <a href="https://zhuanlan.zhihu.com/p/57736094" target="_blank"> <div class="boxall" style="height:4.5rem;display: flex;flex-wrap: wrap;padding: 10px">

                  <div style="width: 100%;height: 50%;display: flex;justify-content: center;align-items: center">
                      <img src="./images/船3.png" alt="" style="width: 90%;height: 90%">
                  </div>
                  <div style="width: 100%;height: 50%;box-sizing: border-box;padding: 10px">
                      <p
                              style="color: white;display: flex;justify-content: center;align-items: center;font-size:
                              15px;font-weight: bold">&nbsp;&nbsp;&nbsp;&nbsp;SAR舰船目标检测概述：<br><br>
                          &nbsp;&nbsp;&nbsp;&nbsp;合成孔径雷达(Synthetic Aperture Radar, SAR)具有全天候、全天时、不受天气影响等成像特点，目前已经成为人们对地观测的重要手段之一。通过机载和星载SAR，我们能够获得大量的高分辨率SAR海洋图像，舰船目标和舰船的航迹也在这些图像中清晰可见。从SAR图像中检测舰船目标有着广泛的应用前景，在军事领域，对特定目标进行位置检测，有利于战术部署，提高海防预警能力；在民用邻域，对某些偷渡、非法捕鱼船只进行检测，有助于海运的监测与管理。</p>
                  </div>
                  <div class="boxfoot"></div>
              </div></a>
          </li>
    <li>

          <div class="map">
<!--        <div class="map1"><img src="picture/lbx.png"></div>-->
<!--        <div class="map2"><img src="picture/jt.png"></div>-->
<!--        <div class="map3"><img src="picture/map.png"></div>-->
<!--        <div class="map4" id="map_1"></div>-->
              <div class="map1"><img src="picture/lbx.png"></div>
              <div class="map2"><img src="picture/jt.png"></div>
      </div>
        </li>
    <li>
        <a href="https://zhuanlan.zhihu.com/p/458358636" target="_blank">  <div class="boxall"
                                                                 style="height:4.5rem;display: flex;flex-wrap: wrap;padding: 10px">

            <div style="width: 100%;height: 50%;display: flex;justify-content: center;align-items: center">
                <img src="./images/船4.png" alt="" style="width: 90%;height: 90%">
            </div>
            <div style="width: 100%;height: 50%;box-sizing: border-box;padding: 10px">
                <p
                        style="color: white;display: flex;justify-content: center;align-items: center;font-size:
                              15px;font-weight: bold">&nbsp;&nbsp;&nbsp;&nbsp;智慧舰船三维可视化管理：<br><br>
                    &nbsp;&nbsp;&nbsp;&nbsp;
                    跨入新世纪以来，云计算、大数据、人工智能等新一代信息技术正迅猛发展。通过利用新兴技术的优势，使海事业各方通过数据联系在一起，实现复杂问题简单化，隐性成本显性化。开展探索海事监管新模式，同时也催生了新作战思想和作战手段，成为继机械化、数字化后推动新一轮产业变革的强大动力。</p>
            </div>
            <div class="boxfoot"></div>
        </div></a>
        <a href="http://media.people.com.cn/GB/n1/2020/0116/c431271-31552114.html" target="_blank">  <div class="boxall" style="height:4.5rem;display: flex;flex-wrap: wrap;padding: 10px">

            <div style="width: 100%;height: 50%;display: flex;justify-content: center;align-items: center">
                <img src="./images/船5.png" alt="" style="width: 90%;height: 90%">
            </div>
            <div style="width: 100%;height: 50%;box-sizing: border-box;padding: 10px">
                <p
                        style="color: white;display: flex;justify-content: center;align-items: center;font-size:
                              15px;font-weight: bold">&nbsp;&nbsp;&nbsp;&nbsp;基于Mask RCNN算法的遥感图像舰船目标旋转检测：<br><br>
                    &nbsp;&nbsp;&nbsp;&nbsp;
                    近年来，随着遥感图像分辨率的提高，遥感目标检测（例如飞机、船舶、油桶等检测）已成为研究热点。遥感目标检测具有广泛的应用，如军事调查、灾难救援和城市交通管理。针对舰船目标检测问题，本文创新性的利用旋转框标注的遥感数据集DOTA对Mask RCNN算法进行训练。在对后续的性能分析中，陆续引入群组归一化、权重标准化和可变卷积以提升对旋转框的检测效率。</p>
            </div>
            <div class="boxfoot"></div>
        </div></a>
        </li>
  </ul>
    </div>
<div class="back"></div>
<script language="JavaScript" src="js/js.js"></script> 
<script type="text/javascript" src="js/echarts.min.js"></script> 
<script type="text/javascript" src="js/china.js"></script> 
<script type="text/javascript" src="js/area_echarts.js"></script> 
<script type="text/javascript">	
  $(document).ready(function(){
		myChart1.resize();
	　 myChart2.resize();
		myChart3.resize();  
		myChart6.resize();
	 　myChart7.resize();
		myChart8.resize(); 
})
window.addEventListener("resize", function () {
    	myChart1.resize();
	　 myChart2.resize();
		myChart3.resize();  
		myChart6.resize();
	 　myChart7.resize();
		myChart8.resize();   
});	
	</script> 
<script type="text/javascript">
		var v0=1000//总
		var v1=353//
		var v2=178//
		var v3=68//新增
					
		

        var myChart6 = echarts.init(document.getElementById('echarts6'));
      option6 = {
 series: [{	
        type: 'pie',
        radius: ['70%', '80%'],
        color:'#0088cc',
        label: {
            normal: {
            position: 'center'
            }
        },
        data: [{
            value: v1,
            name: '新增会员',
            label: {
                normal: {
                    formatter: v1 +'',
                    textStyle: {
                        fontSize:20,
						color:'#fff',
                    }
                }
            }
        }, 
			   {
            value: v0,
            name: '老会员',
            label: {
                normal: {
                 formatter : function (params){
                return '占比'+Math.round( v1/v0*100)+ '%'
            },
                    textStyle: {
                        color: '#aaa',
                        fontSize: 12
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: 'rgba(255,255,255,.2)'
                },
                emphasis: {
                    color: '#fff'
                }
            },
        }]
    }]
  
};

	var myChart7 = echarts.init(document.getElementById('echarts7'));
      option7 = {
    series: [{	
        type: 'pie',
        radius: ['70%', '80%'],
        color:'#fccb00',
        label: {
            normal: {
                position: 'center'
            }
        },
        data: [{
            value: v2,
            name: '新增领卡会员',
            label: {
                normal: {
                    formatter: v2 +'',
                    textStyle: {
                        fontSize: 20,
						color:'#fff',
                    }
                }
            }
        }, 
			   {
            value: v0,
            name: '总领卡会员',
            label: {
                normal: {
                 formatter : function (params){
                return '占比'+Math.round( v2/v0*100)+ '%'
            },
                    textStyle: {
                        color: '#aaa',
                        fontSize: 12
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: 'rgba(255,255,255,.2)'
                },
                emphasis: {
                    color: '#fff'
                }
            },
        }]
    }]
};
		

 var myChart8 = echarts.init(document.getElementById('echarts8'));
      option8 = {
	
		
    series: [{
		
        type: 'pie',
        radius: ['70%', '80%'],
        color:'#62b62f',
        label: {
            normal: {
                position: 'center'
            }
        },
        data: [{
            value: v3,
            name: '女消费',
            label: {
                normal: {
                    formatter: v3 +'',
                    textStyle: {
                        fontSize: 20,
						color:'#fff',
                    }
                }
            }
        }, {
            value: v0,
            name: '男消费',
            label: {
                normal: {
                 formatter : function (params){
                return '占比'+Math.round( v2/v0*100)+ '%'
            },
                    textStyle: {
                        color: '#aaa',
                        fontSize: 12
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: 'rgba(255,255,255,.2)'
                },
                emphasis: {
                    color: '#fff'
                }
            },
        }]
    }]
};
setTimeout(function(){ 
myChart6.setOption(option6);
myChart7.setOption(option7);
myChart8.setOption(option8);	
}, 500);
		
</script> 
<script type="text/javascript">
        var myChart1 = echarts.init(document.getElementById('echarts1'));
		var v1=298//男消费
		var v2=523//女消费
		var v3=v1+v2//总消费 
      option1 = {
	
//animation: false,
    series: [{	
        type: 'pie',
        radius: ['70%', '80%'],
        color:'#0088cc',
        label: {
            normal: {
                position: 'center'
            }
        },
        data: [{
            value: v1,
            name: '平均单客价',
            label: {
                normal: {
                    formatter: v3 +'',
                    textStyle: {
                        fontSize: 20,
						color:'#fff',
                    }
                }
            }
        }, 
		]
    }]
};
		
		
		 var myChart3 = echarts.init(document.getElementById('echarts3'));
		var v1=298//男消费
		var v2=523//女消费
		var v3=v1+v2//总消费 
      option2 = {
	
//animation: false,
    series: [{	
        type: 'pie',
        radius: ['70%', '80%'],
        color:'#fccb00',
        label: {
            normal: {
                position: 'center'
            }
        },
        data: [{
            value: v1,
            name: '男消费',
            label: {
                normal: {
                    formatter: v1 +'',
                    textStyle: {
                        fontSize: 20,
						color:'#fff',
                    }
                }
            }
        }, {
            value: v2,
            name: '女消费',
            label: {
                normal: {
                 formatter : function (params){
                return '占比'+Math.round( v1/v3*100)+ '%'
            },
                    textStyle: {
                        color: '#aaa',
                        fontSize: 12
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: 'rgba(255,255,255,.2)'
                },
                emphasis: {
                    color: '#fff'
                }
            },
        }]
    }]
};
		

 var myChart2 = echarts.init(document.getElementById('echarts2'));
      option3 = {
	
		
    series: [{
		
        type: 'pie',
        radius: ['70%', '80%'],
        color:'#62b62f',
        label: {
            normal: {
                position: 'center'
            }
        },
        data: [{
            value: v2,
            name: '女消费',
            label: {
                normal: {
                    formatter: v2 +'',
                    textStyle: {
                        fontSize: 20,
						color:'#fff',
                    }
                }
            }
        }, {
            value: v1,
            name: '男消费',
            label: {
                normal: {
                 formatter : function (params){
                return '占比'+Math.round( v2/v3*100)+ '%'
            },
                    textStyle: {
                        color: '#aaa',
                        fontSize: 12
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: 'rgba(255,255,255,.2)'
                },
                emphasis: {
                    color: '#fff'
                }
            },
        }]
    }]
};
setTimeout(function(){ 
myChart1.setOption(option1);
 myChart2.setOption(option2);
myChart3.setOption(option3);	
}, 500);
		
</script> 
<script type="text/javascript">
        var myChart = echarts.init(document.getElementById('echarts4'));
       var plantCap = [{
    name: '工业',
    value: '222'
}, {
    name: '农业',
    value: '115'
}, {
    name: '互联网',
    value: '113'
}, {
    name: '医疗',
    value: '95'
}, {
    name: '文学',
    value: '92'
},{
    name: '服装',
    value: '87'
}];
var datalist = [{
    offset: [56, 48],
    symbolSize: 110,
   // opacity: .95,
    color: 'rgba(73,188,247,.14)',
	
}, {

    offset: [30, 70],
    symbolSize: 70,
     color: 'rgba(73,188,247,.14)'
}, {
    offset: [0, 43],
    symbolSize: 60,
    color: 'rgba(73,188,247,.14)'

}, {
    offset: [93, 30],
    symbolSize: 70,
     color: 'rgba(73,188,247,.14)'
}, {
    offset: [26, 19],
    symbolSize: 65,
    color: 'rgba(73,188,247,.14)'
}, {
    offset: [75, 75],
    symbolSize: 60,
     color: 'rgba(73,188,247,.14)'

}];

var datas = [];
for (var i = 0; i < plantCap.length; i++) {
    var item = plantCap[i];
    var itemToStyle = datalist[i];
    datas.push({
        name: item.value + '\n' + item.name,
        value: itemToStyle.offset,
        symbolSize: itemToStyle.symbolSize,
        label: {
            normal: {
                textStyle: {
                    fontSize: 14
                }
            }
        },

        itemStyle: {
            normal: {
               color: itemToStyle.color,
                opacity: itemToStyle.opacity
           }
        },
    })
}
option = {
    grid: {
        show: false,
        top: 10,
        bottom: 10
    },

    xAxis: [{
        gridIndex: 0,
        type: 'value',
        show: false,
        min: 0,
        max: 100,
        nameLocation: 'middle',
        nameGap: 5
    }],

    yAxis: [{
        gridIndex: 0,
        min: 0,
        show: false,
        max: 100,
        nameLocation: 'middle',
        nameGap: 30
    }],
    series: [{
        type: 'scatter',
        symbol: 'circle',
        symbolSize: 120,
        label: {
            normal: {
                show: true,
                formatter: '{b}',
                color: '#FFF',
                textStyle: {
                    fontSize: '30'
                }
            },
        },
        itemStyle: {
            normal: {
                color: '#F30'
            }
        },
        data: datas
    }]

};
 myChart.setOption(option);
	$(document).ready(function(){
	　　myChart.resize();  
	
})
window.addEventListener("resize", function () {
　　myChart.resize();  
});
</script>
<!--大屏-->
<script type="text/javascript" src="js/jquery.waypoints.min.js"></script>
<script type="text/javascript" src="js/jquery.countup.min.js"></script>
	<script type="text/javascript">
		$('.counter').countUp();
	</script>
</body>
</html>
